import { useState, useEffect } from 'react'
import './App.css'
import routes from './router/index';
import { useRoutes } from "react-router-dom"
import bagUrl from "../src/assets/logo.57933597.png"
import { NavLink } from "react-router-dom"
import React from 'react';
import { useNavigate, useLocation } from "react-router-dom"
import { message } from 'antd';
function App() {
    const routerView = useRoutes(routes)
    const [messageApi, contextHolder] = message.useMessage();
    const [count, setCount] = useState(0)
    const [Token, setToken] = useState(false)
    const navigate = useNavigate()
    const location = useLocation()
    const clicked = () => {
        localStorage.removeItem("setToken", "");
        messageApi.open({
            type: 'success',
            content: '退出登录',  
        });
        console.log(location);
        if (location.pathname == "/shopCar") {
            setTimeout(() => {
                location.pathname("/");
            }, 2000);
        }
    }
    useEffect(function () {
        setToken(localStorage.getItem("setToken"))
    }, [localStorage.getItem("setToken")])



    return (
        <div className="App">
            <div>
                <div className='root'>
                    {contextHolder}
                    <div className='box'>
                        <div className='eee'>
                            <div className='left-content'>
                                <img src={bagUrl} alt="" />
                                {
                                    Token ?
                                        <div className="jump">
                                            <NavLink to="/" className="underline">首页</NavLink>
                                            <NavLink to="/shopCar" >购物车</NavLink>
                                            <a href="#" onClick={clicked}>退出登录</a>
                                        </div>

                                        :
                                        <div className="jump">
                                            <NavLink to="/" className="underline">首页</NavLink>
                                            <NavLink to="/register" className="underline">登录</NavLink>
                                            <NavLink to="/login" className="underline">注册</NavLink>
                                        </div>
                                }
                            </div>

                        </div>

                    </div>

                </div>
            </div>
            {routerView}

        </div>
    )
}

export default App
